layui.config({
    base: '../../layui/' //此处路径请自行处理, 可以使用绝对路径
}).use(['jquery', 'form', 'layer', 'element'], function () {
    const form = layui.form
        , layer = layui.layer
        , $ = layui.jquery
        , element = layui.element
    ;

    $(function () {
        element.render();
        setTimeout(function () {
            //日志实时更新
            logWebsocket();
            //上传进度实时更新
            uploadWebsocket();
            //查询当前部署状态
            lastDeploy();
        }, 500)

    });

    //查询当前部署状态
    function lastDeploy() {
        let ele = layui.element;
        const id = $("#id").val();
        $.ajax({
            type: "get",//方法类型
            dataType: "json",//预期服务器返回的数据类型
            url: "/admDockerDeploy/getById/" + id,//url
            success: function (result) {
                if (result.code == 0) {
                    const data = result.data;
                    $("#fileSize").html(data.fileSize == null ? "" : data.fileSize);
                    $("#speed").html(data.speed == null ? "" : data.speed);
                    $("#transfered").html(data.transfered == null ? "" : data.transfered);
                    $('#speedOfProgress').attr('lay-percent', data.speedOfProgress == null ? "0%" : data.speedOfProgress);
                    ele.init();
                    ele.progress('speedOfProgress', data.speedOfProgress == null ? "0%" : data.speedOfProgress);
                    //
                }
            },
            done: function () {
                ele.render();
            }
        })
    }

    //日志实时更新
    function uploadWebsocket() {
        //websocket对象
        let websocket = null;
        //判断当前浏览器是否支持WebSocket
        if ('WebSocket' in window) {
            websocket = new WebSocket("ws://" + sessionStorage.getItem('hostName') + "/websocket/logging");
        } else {
            console.error("不支持WebSocket");
        }
        //连接发生错误的回调方法
        websocket.onerror = function (e) {
            console.error("WebSocket连接发生错误", e);
        };
        //连接成功建立的回调方法
        websocket.onopen = function () {
            console.log("WebSocket连接成功")
        };
        //接收到消息的回调方法
        websocket.onmessage = function (event) {
            const id = $("#id").val();
            //追加
            if (event.data) {
                let data = $.parseJSON(event.data);
                if (data.table == "uploadDockerJar") {
                    if (id == data.id) {
                        $("#fileSize").html(data.fileSize);
                        $("#speed").html(data.speed);
                        $("#transfered").html(data.transfered);
                        element.progress('speedOfProgress', data.speedOfProgress);
                    }
                }
            }
        };
        //连接关闭的回调方法
        websocket.onclose = function () {
            console.log("WebSocket连接关闭")
            setTimeout(function() {
                uploadWebsocket();  // 重新连接 WebSocket
            }, 5000);
        };
    }

    //日志实时更新
    function logWebsocket() {
        //websocket对象
        let websocket = null;
        //判断当前浏览器是否支持WebSocket
        const id = $("#id").val();
        if ('WebSocket' in window) {
            websocket = new WebSocket("ws://" + sessionStorage.getItem('hostName') + "/websocket/docker/singleLogs/" + id);
        } else {
            console.error("不支持WebSocket");
        }

        //连接发生错误的回调方法
        websocket.onerror = function (e) {
            console.error("WebSocket连接发生错误", e);
        };
        //连接成功建立的回调方法
        websocket.onopen = function () {
            console.log("WebSocket连接成功")
        };
        //接收到消息的回调方法
        websocket.onmessage = function (event) {
            //追加
            if (event.data) {
                //日志内容
                let div = $("#loggingText");
                div.append(event.data);
                // //滚动条自动到最底部
                let msg_end = document.getElementById('loggingText');
                msg_end.scrollTop = msg_end.scrollHeight;
                if (event.data.indexOf("部署完毕") != -1) {
                    console.log("部署完毕")
                }
            }
        };
        //连接关闭的回调方法
        websocket.onclose = function () {
            console.log("WebSocket连接关闭")
        };
    }
});